import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
import "qrc:///"
import QtGraphicalEffects 1.0

Window {
    id:mainWindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

//    Component {
//        id: mainView
//        CHomeView{}
//    }

//    StackView {
//        id: stack
//        anchors.fill: parent
//        initialItem: mainView
//    }

    //进度条4
    ProgressBar{
        id:bar
        value: 0.1
        width: 300
        height: 50
        contentItem: Rectangle {    //内容项
            id:barBg
            color: "#e5f2ff"         //进度条背景
            radius: bar.height/2
            //图形剪切
            layer.enabled: true
            layer.effect: OpacityMask{
                maskSource: Rectangle{
                    width: barBg.width
                    height: barBg.height
                    radius: bar.height/2
                }
            }
            Rectangle {
                width: bar.visualPosition * bar.width
                height: bar.height
                radius: bar.height/2
                color: "#66b2ff"  //进度条前景
            }
        }
    }

    Slider{
        anchors.top: bar.bottom
        anchors.topMargin: 10
        width: bar.width
        height: 20
        from:0.0
        to:1.0
        onValueChanged: {
            bar.value = value
        }
    }

    Rectangle{
        id:bg
        x:20
        y:100
        width: 200
        height: 30

        color: "red"
        radius: 15
//        clip: true

        layer.enabled: true
        layer.effect: OpacityMask{
            maskSource: Rectangle{
                width: 200
                height: 30
                radius: 15
            }
        }

        Rectangle{
            anchors.fill: parent
            color: "#800000ff"
            clip: true
        }
    }


//    Button {
//        anchors.left: button
//        text: "菜单"
//        anchors.leftMargin: 12
//        onClicked: popupMenu.popup()
//    }

//    Menu {
//        id : popupMenu
//        title: "&File"

//        MenuItem {
//            text: "&Open"
//            onTriggered:{}
//        }

//        MenuItem {
//            text: "&Save"
//            onTriggered: {}
//        }

//        MenuItem {
//            text: "&Close"
//            checkable: true
//            onTriggered: {}
//        }
//    }

}
